<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./src/css/login.css">
    <script src="./src/js/jquery.min.js"></script>
    <script src="./src/js/login.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.js"></script>
</head>

<body>
    <div>
        <div class="bx logo">
            <img src="./src/image/loginimg/logo-icon.png" alt="">
        </div>
        <div class="content bx">
            <img src="./src/image/loginimg/7a8e71a9c83a4e3ca4dcd9bb5137db30 (1).png" alt="">
        </div>
        <div class="bottom bx">
            <p>万表网名表商城 版权所有 2008-2017 ICP备案证书号:粤ICP备09108738号 网监备案:4401060103141</p>
            <p> 广州市万表科技股份有限公司 地址:广州市番禺区番禺大道北60-1号</p>
            <p> Copyright 2008-2017 WWW.WBIAO.CN.LTD ALL RIGHT RESERVED.</p>
        </div>

        <!-- 410 490 -->
        <div class="loginPic">
            <form action="#">
                <div class="model_1">
                    <div class="line1">
                        <span>|</span>
                        <ul>
                            <li>会员登录</li>
                            <li>扫码登录</li>
                        </ul>
                    </div>
                    <div class="line2 current">
                        <div class="line2_1">
                            <input type="text" placeholder="手机号码">
                        </div>
                        <div class="line2_2">
                            <div>
                                <input type="text" placeholder="请输入图形验证码">
                            </div>
                            <div>
                                <img src="./src/image/loginimg/captcha2.png" alt="">
                            </div>
                        </div>
                        <div class="line2_3">
                            <div>
                                <input type="text" placeholder="短信验证码">
                            </div>
                            <div class="line2_3_1">获取验证码</div>
                        </div>
                        <div class="line2_4">
                            <button>立即登陆</button>
                        </div>
                        <div class="line2_5"><a href="./register.html">免费注册</a></div>
                        <div class="line2_6">
                            <ul>
                                <li class="aaa">账号密码</li>
                                <li>|</li>
                                <li>社交登陆</li>
                            </ul>
                        </div>
                    </div>
                    <div class="line2">
                        <div class="line2__1">
                            <img src="./src/image/loginimg/qr.png" alt="">
                            <p>使用<span>万表APP</span>扫码登录</p>
                            <p>在首页顶部搜索栏点击扫一扫</p>
                            <div>下载万表APP</div>
                        </div>
                    </div>
                </div>
                <div class="model_2">
                    <div class="line2_1">
                        <input type="text" placeholder="手机号码 / 会员名 / 邮箱" name="name">
                    </div>
                    <div class="line2_1">
                        <input type="text" placeholder="密码" name="pwd">
                    </div>
                    <div class="line2_4">
                        <button>立即登陆</button>
                    </div>
                    <div class="line2_5">
                        <div>免费注册</div>
                        <div>忘记密码</div>
                    </div>
                    <div class="line2_6">
                        <ul>
                            <li class="bbb">手机动态码登陆</li>
                            <li>|</li>
                            <li>社交登陆</li>
                        </ul>
                    </div>
                </div>
            </form>
        </div>
    </div>

</body>

</html>
<script>
    $(function () {
        $('form').on('submit', function () {
            var index = layer.load(1, {
                shade: [0.1, '#fff']
            });
            $('#login').prop('disabled', true)
            $.ajax({
                url: '/api/login',
                type: "post",
                data: $(this).serialize(),
                success(res) {
                    layer.close(index);
                    layer.msg(res.msg)
                    $('#login').prop('disabled', false)
                    if (res && res.code == 200) {
                        localStorage.setItem('user', JSON.stringify(res.data))
                        location = './index.html'
                    }
                }
            })

            return false;
        })
    })
</script>